<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <button>Click</button>
  <a>remove</a>
  <script src="./index.js"></script>
  <script>
    const eventEmitter = new EventEmitter();
    const fn1 = (arg) => {
      console.log('1',arg);
    }
    const fn2 = (arg) => {
      console.log('2', arg);
    }
    const fn3 = (arg) => {
      console.log('3', arg);
    }
    const once = (arg) => {
      console.log('once', arg);
    }
    eventEmitter.on('testEv', fn1).on('testEv', fn2)
    eventEmitter.on('click', fn1);
    eventEmitter.on('click', fn2);
    eventEmitter.once('click', once);
    document.querySelector('button').addEventListener('click', () => {
      eventEmitter.emit('testEv', [1,2,3,4]);
      eventEmitter.emit('click', [1])
    });
    document.querySelector('a').addEventListener('click', () => {
      eventEmitter.off('testEv', fn1).on('testEv', fn3)
      eventEmitter.off('click', once);
      return false;
    })
  </script>
</body>
</html>